<html>
<head>
    <title></title>
    <style>
        body{
            text-align:center;
        }

      input[type=submit]{
            background-color: #fff ;
            color:#000;
        }
        table#books{
            width: 80%;
        }

        table#books, tr, th, td{
            text-align: center;
            border: 1px solid #000000;
            border-collapse: collapse;
            padding: 0px 0px 0px 0px;
            margin: 0px 0px 0px 0px;
       } 

    </style>
</head>
<body>
    {{ msg }}

    <form action="{% url "book-browse" %}" id="search" method="post">
        {% csrf_token %}
        <input type="text" id="search-text" name="search_text" placeholder="search">
        <input type="submit" id="search-btn" value="Search">
    </form>
    <br>
    <div style="text-aline: center">
    <table id="books" >
        <tr>
            <th>Name</th>
            <th>Isin</th>
            <th>Author</th>
            <th>Pages</th>
            <th>Price</th>
            <th>Publish</th>
        </tr>
    {% for book in books %}
        <tr>
            <td><a href="{% url "book-detail"  book.id  %}">{{ book.name }}</a></td>
            <td>{{ book.isin}}</td>
            <td>{{ book.author}}</td>
            <td>{{ book.pages}}</td>
            <td>{{ book.price}}</td>
            <td>{{ book.publish_date | date:"Y-m-d"}}</td>
        </tr>
    {% endfor %}
    </table>
    </div>
</body>
</html>